<script setup lang="ts">
import { storeToRefs } from "pinia";
import { useAccountStore } from "@/stores/account";
import { handleToPage, toLoginPage } from "@/utils";

const { hasLogin, userInfo } = storeToRefs(useAccountStore());

const handleClickUserInfo = () => {
  if(!hasLogin.value) toLoginPage();
  // uni.navigateTo({ url:'/pages/user/profile'});
}
</script>

<template>
<view class="relative overflow-hidden">
  <view class="sticky top-0">
    <uv-navbar bgColor="transparent" leftIcon="" title="" placeholder></uv-navbar>
  </view>
  
  <view class="flex items-center gap-5 mx-4" @click="handleClickUserInfo()">
    <view class="size-16 border-(2 solid white) rounded-full shadow-lg overflow-hidden">
      <image class="size-16 align-middle" :src="userInfo.avatar || 'https://static.minglvtang.com/images/avatar_empty.jpeg'" mode="widthFix" />
    </view>
    <view class="grid gap-2">
      <view class="text-(lg black/80)">{{hasLogin ? userInfo.nickname || "微信用户" : "请登录"}}</view>
      <view class="flex bg-gradient-to-b from-#1B7BF1 to-#0D3884 rounded-full" v-if="userInfo.user_level">
        <image class="size-5 align-middle" src="https://static.minglvtang.com/images/icons/badge.png" mode="widthFix" />
        <view class="px-2 text-(sm white)">{{userInfo.user_level?.level || "律师"}}</view>
      </view>
    </view>
  </view>

  <view class="grid grid-cols-2 gap-2 mx-4 mt-2">
    <view class="h-23 pt-5 px-3 flex flex-col justify-center bg-(contain no-repeat [url(https://static.minglvtang.com/images/bg_integral.png)])" @click="handleToPage('/pages/user/integral')">
      <view class="text-(sm #253851)">我的水滴</view>
      <view class="text-(xl #0B3E89) font-700 truncate">{{userInfo.integral || "0.00"}}</view>
      <view class="text-(xs #7889AE)">积分可进行提现兑换</view>
    </view>

    <view class="h-23 pt-5 px-3 flex flex-col justify-center bg-(contain no-repeat [url(https://static.minglvtang.com/images/bg_cheese.png)])" @click="handleToPage('/pages/user/cheese')">
      <view class="text-(sm #B56108)">我的奶酪</view>
      <view class="text-(xl #B56108) font-700 truncate">{{userInfo.cheese || "0.00"}}</view>
      <view class="text-(xs #B67E37)">积分可进行提现兑换</view>
    </view>
  </view>

  <view class="mx-4 bg-white mt-5 px-5 rounded-lg">
    <page-cell 
      icon="https://static.minglvtang.com/images/icons/great.png" 
      title="我的推荐" 
      @click="handleToPage('/pages/user/recommend')"
    ></page-cell>

    <page-cell 
      icon="https://static.minglvtang.com/images/icons/teacup.png" 
      title="我的活动" 
      @click="handleToPage('/pages/user/activity')"
    ></page-cell>

    <page-cell 
      icon="https://static.minglvtang.com/images/icons/star.png" 
      title="我的收藏" 
      @click="handleToPage('/pages/user/collect')"
    ></page-cell>

    <page-cell 
      icon="https://static.minglvtang.com/images/icons/needs.png" 
      title="我的需求" 
      @click="handleToPage('/pages/user/needs')"
    ></page-cell>

    <page-cell 
      icon="https://static.minglvtang.com/images/icons/clock.png" 
      title="兑换记录" 
      @click="handleToPage('/pages/user/order')"
    ></page-cell>
<!-- 
    <page-cell 
      icon="https://static.minglvtang.com/images/icons/invite.png" 
      title="邀请记录" 
      @click="handleToPage('/pages/user/invite')"
    ></page-cell> 
-->
  </view>

  <view class="mx-4 bg-white mt-5 px-5 rounded-lg">
     
    <page-cell 
      icon="https://static.minglvtang.com/images/icons/message.png" 
      title="我的消息" 
      @click="handleToPage('/pages/user/message')"
    ></page-cell>
   
    <page-cell 
      icon="https://static.minglvtang.com/images/icons/user.png" 
      title="我的资料" 
      @click="handleToPage('/pages/user/profile')"
    ></page-cell>
    
    <!-- #ifdef MP-WEIXIN -->
    <!-- 
    <page-cell 
      icon="https://static.minglvtang.com/images/icons/serve.png" 
      title="客服" 
      @click="openServiceChat()"
    ></page-cell> 
    -->
    
    <button class="btn-reset h-7.5 py-2 flex gap-2 items-center border-t-(~ solid #F4F6F7)" open-type="contact">
      <image class="size-5 align-middle" src="https://static.minglvtang.com/images/icons/serve.png" />
      <view class="flex-1 text-(sm black/80)">客服</view>
      <view class="i-ri-arrow-right-s-line"></view>
    </button>
   
    <!-- #endif -->

    <page-cell 
      icon="https://static.minglvtang.com/images/icons/setting.png" 
      title="设置" 
      @click="handleToPage('/pages/user/settings')"
    ></page-cell>
  </view>
</view>
</template>
